<template>
    <div>
        <RegisterInfoList ref="listSearchFef" @onAdd="visibleAdd = true" />
        <RegisterInfoAdd v-if="visibleAdd" @onClose="onClose" />
    </div>
</template>

<script lang="ts">
import { toRefs, reactive, onMounted, ref, defineComponent, provide } from 'vue';
import RegisterInfoList from './component/register-info-list.vue';
import RegisterInfoAdd from './component/register-info-add.vue';

interface State {
    visibleAdd: boolean | false,
}

export default defineComponent({
    name: 'RegisterInfo',
    components: { RegisterInfoList, RegisterInfoAdd },
    setup() {
        const listSearchFef = ref();
        const selectRow = reactive({});
        const state = reactive<State>({
            visibleAdd: false,
        });
        provide('detailData', selectRow);
        const methodMap = reactive({
            onClose: function() {
                state.visibleAdd = false;
            }
        });
        // 页面加载时
        onMounted(() => {
            listSearchFef.value.onSearch();
        });
        return {
            listSearchFef,
            ...toRefs(state),
            ...toRefs(methodMap),
            ...toRefs(selectRow)
        };
    },
});
</script>
